<template>
    <Dashboard :menu="menu">
        <el-row>
            <el-row>
                <el-button type="primary" @click="addFull">新增</el-button>
            </el-row>
            <el-table :data="fullData" stripe style="margin-top:24px">
                <el-table-column prop="limit_price" label="使用条件" header-align="center" align="center">
                    <template slot-scope="scope">
                        <span>满{{scope.row.limit_price}}减{{scope.row.price}}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="free_delivery" label="免配送费" header-align="center" align="center">
                    <template slot-scope="scoped">
                        <el-row style="font-weight:700;color:#19be6b" v-if="scoped.row.free_delivery">是</el-row>
                        <el-row style="font-weight:700;color:#f50" v-else>否</el-row>
                    </template>
                </el-table-column>
                <el-table-column prop="status" label="状态" header-align="center" align="center">
                    <template slot-scope="scoped">
                        <el-row style="font-weight:700;color:#19be6b" v-if="scoped.row.status">开启</el-row>
                        <el-row style="font-weight:700;color:#f50" v-else>关闭</el-row>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center" header-align="center" width="100">
                    <template slot-scope="scope">
                        <el-tooltip content="编辑">
                            <i class="iconfont icon-bianji1" @click='fullEdit(scope.row)' style="font-size:26px;cursor:pointer;color:rgb(158, 167, 179)"></i>
                        </el-tooltip>
                        <el-tooltip content="删除">
                            <i class="iconfont icon-shanchu2" @click="fullDel(scope.row)" style="font-size:26px;cursor:pointer;color:rgb(158, 167, 179)"></i>
                        </el-tooltip>
                    </template>
                </el-table-column>
            </el-table>
            <el-row style="margin:24px 0">
                <el-col :span="24" style="text-align:right">
                    <el-pagination background layout="total,prev,pager,next" :total="pagination.rowCount" :page-size="pagination.pageSize" @current-change="changePage"></el-pagination>
                </el-col>
            </el-row>
        </el-row>
    </Dashboard>
</template>

<script>
import Dashboard from "./../../../components/Dashboard.vue";
export default {
    components: {
        Dashboard
    },
    data() {
        return {
            menu: [
                {
                    name: "满减活动",
                    icon: "icon-manjian",
                    sub: [
                        {
                            name: "满减列表",
                            url: "/shop/full"
                        }
                    ]
                }
            ],
            fullData: [],
            pagination: {}
        };
    },
    async asyncData({ app }) {
        let data = {};
        //满减列表
        const full = await app.$axios.$get(
            "/api/shop/home/shop/plugin/full/index"
        );
        if (full && full.errmsg === "ok") {
            data.fullData = full.data.data;
            data.pagination = full.data.pagination;
        }
        return data;
    },
    methods: {
        //满减列表
        async getData() {
            let url = `/api/shop/home/shop/plugin/full/index?page=${
                this.pagination.page
            }`;
            const res = await this.$axios.$get(url);
            if (res && res.errmsg === "ok") {
                this.fullData = res.data.data;
                this.pagination = res.data.pagination;
            }
        },
        changePage(page) {
            this.pagination.page = page;
            this.getData();
        },
        addFull() {
            this.$router.push("/shop/full/edit");
        },
        fullEdit(row) {
            this.$router.push({
                path: "/shop/full/edit",
                query: {
                    id: row.id
                }
            });
        },
        async fullDel(row) {
            const res = await this.$axios.$get(
                `/api/shop/home/shop/plugin/full/del?id=${row.id}`
            );
            if (res && res.errmsg === "ok") {
                this.$message.success("删除成功");
                this.getData();
            }
        }
    }
};
</script>
